<!-- components/custom-form/custom-form.vue -->
<template>
    <uni-forms label-width="0">
        <uni-forms-item>
            <uni-easyinput
                type="text"
                :clearable="false"
                placeholder="请输入手机号"
            />
        </uni-forms-item>
        <uni-forms-item>
            <uni-easyinput
                type="password"
                :clearable="false"
                placeholder="请输入密码"
            />
        </uni-forms-item>
        <uni-forms-item>
            <uni-easyinput type="textarea" :clearable="false" />
        </uni-forms-item>
    </uni-forms>
    <button type="primary">提交</button>
</template>

<script setup>
    // #ifdef MP-WEIXIN
    defineOptions({
        options: {
            // 修改组件内部样式：微信小程序端写法
            styleIsolation: 'shared',
        },
    })
    // #endif
</script>

<style lang="scss">
    .uni-forms {
        margin: 20px;
    }

    /* ::v-deep  修改组件内部样式：H5 端的写法 */
    ::v-deep .uni-easyinput__content-input {
        border: 1px solid red;
        padding: 10px;
    }
</style>
